<template>
  <el-pagination
      style="padding-top: 16px;"
      v-model:current-page="props.queryForm.pageNum"
      v-model:page-size="props.queryForm.pageSize"
      :page-sizes="[ 10, 15, 20, 25]"
      :small="false"
      :background="true"
      layout="total, sizes, prev, pager, next, jumper"
      :total="props.queryForm.totalSize"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
  />
</template>

<script setup>
const props = defineProps([
  "queryForm"
])
const emits = defineEmits([
    "my-size-change",
    "my-current-change"
])
const handleSizeChange = ()=> {
  emits("my-size-change", props.queryForm.pageSize)
}
const handleCurrentChange = ()=> {
  emits("my-current-change", props.queryForm.pageNum)
}
</script>

<style scoped>

</style>








<!--      <el-pagination
          style="padding-top: 16px;"
          v-model:current-page="queryForm.pageNum"
          v-model:page-size="queryForm.pageSize"
          :page-sizes="[ 5, 10, 15, 20]"
          :small="false"
          :background="true"
          layout="total, sizes, prev, pager, next, jumper"
          :total="totalSize"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />-->